<template>
  <div class="form form-readonly">
    <div class="group">
      <div class="label">编号</div>
      <div class="txt">{{ state.starinfo?.checkin1?.checkin_no }}</div>
    </div>
    <div class="group">
      <div class="label">姓名</div>
      <div class="txt">{{ state.starinfo?.star?.name }}</div>
    </div>
    <div class="group">
      <div class="label">年龄</div>
      <div class="txt">{{ state.starinfo?.register?.age }}岁</div>
    </div>
    <div class="group">
      <div class="label">身高</div>
      <div class="txt">{{ state.starinfo?.register?.height }}cm</div>
    </div>
    <div class="group">
      <div class="label">履历</div>
      <div class="txt">
        {{ state.starinfo?.register?.history }}
      </div>
    </div>
    <div class="group">
      <div class="label">现场照片</div>
      <div class="imgs">
        <img
          @click="imgShow"
          v-for="(item, index) in photos"
          :key="index"
          :src="item"
        />
      </div>
    </div>
    <div class="comment">
      <div class="tit">导演评语</div>
      <div>
        {{ state.starinfo?.register?.prtest_say }}
      </div>
      <div class="tags">
        <span v-for="(item, index) in tags" :key="index">{{ item }}</span>
      </div>
    </div>
    <div class="status" :class="status"></div>
    <button class="submit" @click="back">返回</button>
  </div>
</template>
<script setup>
import { useRouter, useRoute } from "vue-router";
import ajax from "../../util/http";
import { reactive, ref, computed, getCurrentInstance } from "vue";

const { proxy } = getCurrentInstance();
const router = useRouter();
const route = useRoute();
const state = reactive({
  starinfo: {},
});

ajax
  .post("/star/scene/save_comment", {
    token: JSON.parse(localStorage.getItem("userinfo")).token,
    id: route.query.id,
  })
  .then((res) => {
    if (res.code == 1) {
      state.starinfo = res.data;
    }
  });

const photos = computed(() => {
  if (state.starinfo?.register?.prtest_photo) {
    return state.starinfo.register.prtest_photo.split(",");
  }
});

const status = computed(() => {
  let prtest_result = state.starinfo?.register?.prtest_result;
  if (prtest_result == 1) {
    return "status1"; //晋级
  }
  if (prtest_result == 2) {
    return "status2"; //待定
  }
  if (prtest_result == 3) {
    return "status3"; //淘汰
  }
});

const tags = computed(() => {
  if (state.starinfo?.register?.prtest_tags) {
    return state.starinfo.register.prtest_tags.split("，");
  }
});

const imgShow = (e) => {
  proxy.$popup({
    img: e.target.getAttribute("src"),
  });
};

const back = () => {
  router.back();
};
</script>